<template>
  <div class="app-container">
    <div class="wpm">
      <div class="tab_options">
        <el-radio-group style="margin-bottom: 10px;" v-model="tab_type" size="small" @change="change_type_value">
          <el-radio-button v-for="item in tab_options" v-if="item.isShow==='true'" :key="item.value" border :label="item.value">{{item.label}}</el-radio-button>
        </el-radio-group>
        <div class="tab_content">
          <setup v-model="form" v-if="tab_type=='1'"></setup>
          <qiniu v-model="form" v-if="tab_type=='2'"></qiniu>
        </div>
      </div>
    </div>
  </div>
</template>
<script>
import qiniu from './qiniu'
import setup from './setup'
import _mixins from './mixins'
import request from '@/utils/request'
export default {
  name: 'parameters',
  mixins: [_mixins],
  data() {
    return {
      servicePath: '/system/power',
      tab_options: [],
      tab_type: '1',
      form: {
        setup: {
          name: '',
          keywords: '',
          description: '',
          weixin: '',
          upload_type: '',
          serverUrl: '',
          tel: '',
          email: '',
          copyright: '',
          bottomInfo: ''
        },
        qiniu: {
          access_key: '',
          secret_key: '',
          bucket: '',
          bucket_url: ''
        }
      }
    }
  },
  methods: {
    change_type_value(val) {
      this.tab_type = val
    }
  },
  created() {
    request({ url: '/system/parameter/query', method: 'get' }).then(res => {
      var _data = res.data
      this.$set(this.form, 'setup', {
        name: _data.setup.name || '',
        keywords: _data.setup.keywords || '',
        description: _data.setup.description || '',
        weixin: _data.setup.weixin || '',
        serverUrl: _data.setup.serverUrl || '',
        tel: _data.setup.tel || '',
        upload_type: _data.setup.upload_type || '',
        email: _data.setup.email || '',
        copyright: _data.setup.copyright || '',
        bottomInfo: _data.setup.bottomInfo || ''
      })
      this.$set(this.form, 'qiniu', {
        access_key: _data.qiniu.access_key || '',
        secret_key: _data.qiniu.secret_key || '',
        bucket: _data.qiniu.bucket || '',
        bucket_url: _data.qiniu.bucket_url || ''
      })
      this.tabOptions(_data.setup)
    })
  },
  components: {
    qiniu,
    setup
  }
}

</script>
<style lang="scss" scoped>
.tab_options {
  margin-top: 10px;
  padding: 10px;
}

</style>
